<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta data-th-replace="common/meta::meta">
    <title>Sparta v1.0</title>
    <link rel="stylesheet" data-th-replace="common/mapLink::link">
</head>
<body class="js-route-flag js-map">
<div class="container-map">
    <div class="map" id="map"></div>
    <div class="map-name">
        <h3 class="map-title"><img src="images/title_1.png"/></h3>
    </div>
    <div class="draw-open clearfix animated zoomIn">
        <span class="draw-translation active"></span>
        <span class="draw-polygon"></span>
    </div>
    <div class="zoom animated zoomIn">
        <span class="zoom-item enlarge">+</span>
        <span class="zoom-item diminish">-</span>
    </div>
    <div class="map-info">
        <div class="particulars clearfix">
            <div class="map-item map-time">&nbsp;&nbsp;</div>
            <div class="map-timeIcon"><img src="images/data_1.png"/></div>
            <div class="map-item map-person">关注人数：<span class="person-number">0</span>人</div>
            <div class="map-item map-city">
                <span class="apellation">地市:</span>
                <select class="city select-item" name="city">
                    <option value="">全部</option>
                </select>
            </div>
            <div class="map-item map-city">
                <span class="apellation">区县:</span>
                <select class="county select-item" name="county">
                    <option value="">全部</option>
                </select>
            </div>
            <div class="map-item map-city">
                <span class="apellation">人员类别：</span>
                <select class="category select-item" name="category">
                    <option value="">全部</option>
                    <option value="SD">SD</option>
                    <option value="SH">SH</option>
                    <option value="SA">SA</option>
                    <option value="SJ">SJ</option>
                    <option value="QT">QT</option>
                </select>
            </div>
            <div class="map-item">
                <span class="apellation">通知人:</span>
                <input type="text" id="alertOthers">
            </div>
            <div class="map-item">
                <span class="apellation">人员编号:</span>
                <input type="text" id="code">
            </div>
            <span class="search">查询</span>
        </div>
    </div>
    <div class="data clearfix">
        <div class="dataLeft clear animated bounceInDown">
            <div class="commBorder">
                <img src="images/bg1.png" class="bg"/>
                <h3 class="title"><img src="images/title1.png"></h3>
                <div class="personDistribution" id="personDistribution"></div>
            </div>
            <div class="commBorder">
                <img src="images/bg2.png" class="bg"/>
                <div class="alarmSituation">
                    <h3 class="title"><img src="images/title_2.png"></h3>
                    <div class="attentionTime" id="attentionTime"></div>
                </div>
            </div>
            <div class="commBorder">
                <img src="images/bg3.png" class="bg"/>
                <h3 class="title"><img src="images/title3.png"></h3>
                <div class="jurisdictionManage" id="jurisdictionManage"></div>
            </div>
        </div>
        <span class="collect fa-gew animated bounceInDown"><i class="fa fa-backward"></i></span>
        <span class="shrink fa-gew animated bounceInDown"><i class="fa fa-forward"></i></span>
        <div class="dataRight clear animated bounceInDown">
            <div class="commBorder">
                <img src="images/bg4.png" class="bg"/>
                <h3 class="title"><img src="images/title5.png"></h3>
                <div class="alarmDistribution" id="alarmDistribution"></div>
            </div>
            <div class="commBorder">
                <img src="images/bg5.png" class="bg"/>
                <div class="alarmSituation">
                    <h3 class="title"><img src="images/title6.png"></h3>
                    <table class="table-alarm">
                        <thead>
                        <tr>
                            <th width="24%">告警时间</th>
                            <th width="25%">人员编号</th>
                            <th width="25%">告警类别</th>
                            <th width="26%">告警内容</th>
                        </tr>
                        </thead>
                        <tbody id="alarmContent">

                        </tbody>
                    </table>
                    <div class="page-box page-gew">
                        <div id="page" class="page clearfix"></div>
                    </div>
                </div>
            </div>
            <div class="commBorder quickIcon">
                <img src="images/bg6.png" class="bg"/>
                <a href="/admin?type=warn" target="_blank">
                    <img src="images/icon1.png" title="告警查询">
                </a>
                <a href="/admin?type=tool" target="_blank">
                    <img src="images/icon2.png" title="小工具">
                </a>
                <a href="/admin?type=log" target="_blank">
                    <img src="images/icon3.png" title="日志">
                </a>
                <a href="/admin?type=control" target="_blank">
                    <img src="images/icon4.png" title="布控">
                </a>
                <a href="/admin?type=modify">
                    <img src="images/icon5.png" title="系统管理">
                </a>
            </div>
        </div>
    </div>
</div>
<!--弹窗-->
<div class="popup" id="popup">
    <input type="hidden" id="input_phoneNum" />
    <input type="hidden" id="input_time" />
    <div class="popup-box clearfix">
        <div class="popup-item popup-left">
            <h3 class="information">所选区域共有<span class="mark"></span>个关注人员</h3>
            <div class="message-scroll">
                <table class="table-message">
                    <thead>
                    <tr>
                        <th width="60%">编号</th>
                        <th width="40%">关注时长(天)</th>
                    </tr>
                    </thead>
                    <tbody class="codeList"></tbody>
                </table>
            </div>
        </div>
        <div class="popup-item popup-right">
            <div class="popup-scroll">
                <div class="message clearfix">
                    <span class="message-info">编号<strong ><span class="show_code"></span></strong>人员数据画像</span>
                    <span class="retract"><i class="fa fa-angle-double-up"></i></span>
                </div>
                <div class="essential clearfix">
                    <div class="person-pic">
                        <img src="images/portrait.gif">
                    </div>
                    <div class="info-box">
                        <div class="information-content clearfix">
                            <div class="info-item">
                                <p class="info-text"><span>编号：</span ><span class="show_code"></span></p>
                                <p class="info-text"><span>通知人姓名：</span><span id="show_noticePeople"></span></p>
                                <p class="info-text"><span>布控开始时间：</span><span id="show_timeStart"></span></p>
                            </div>
                            <div class="info-item">
                                <p class="info-text"><span>告警类别：</span ><span id="show_type"></span></p>
                                <p class="info-text"><span>通知人电话：</span><span id="show_noticePhone"></span></p>
                                <p class="info-text"><span>布控时长：</span><span id="show_controlTime"></span></p>
                            </div>
                            <div class="info-item">
                                <p class="info-text"><span>触警告知方式：</span><span id="show_type1">系统  电话</span></p>
                                <p class="info-text"><span >当前位置信息：</span><span id="show_position"></span></p>
                                <p class="info-text"><span>已关注时长：</span><span id="show_attentionTime"></span></p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="contrail">
                    <ul class="contrail-tab clearfix contrailTab">
                        <li class="active" data-type="/map/predict">轨迹预判</li>
                        <li data-type="/map/trajectory">轨迹回放</li>
                        <li data-type="/relation">密切联系人</li>
                    </ul>
                    <div class="contrail-box">
                        <div class="contrail-item">
                            <iframe class="contrail_iframe fadeIn animated" src="/map/predict" frameborder="0"></iframe>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="http://api.map.baidu.com/api?v=3.0&ak=hydATCXc1miZrGfAmAp7EPE71R4SFYl2"></script>
<script data-main="js/MapMain.js" src="js/lib/require.min.js" defer async="true"></script>
</body>
</html>